<!DOCTYPE html>
<html lang='en'>
  <head>
  <title>Hugo搭建github pages博客 | 百里の博客</title>
  <meta charset='utf-8'>
  <meta name = 'viewport' content = 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no'>
  <meta http-equiv = 'X-UA-Compatible' content = 'IE=edge'>
  <meta name = 'SKYPE_TOOLBAR' content = 'SKYPE_TOOLBAR_PARSER_COMPATIBLE' /><meta name = 'keywords' content = '百里の博客'>
<meta property = 'og:locale' content = 'en_US' />
<meta property = 'og:type' content = 'article' />
<meta property = 'og:title' content = 'hugo搭建github pages博客' />
<meta property = 'og:description' content = '文档参考  hugo官方 hugo官网主题  第一步: 创建一个github pages  https://github.com/new  注意 创建 Repository name 仓库名称时,最好与你的用户名相同,如用户名为:yezihack,站点名为:yezihack.github.io
第二 …'>
<meta property = 'og:url' content = 'https://yezihack.github.io/2019/08/build_hugo/' />
<meta property = 'og:image' content = 'https://yezihack.github.io/images/default.jpg'/>
<link rel='apple-touch-icon' sizes='180x180' href='https://yezihack.github.io/images/favicon.ico'>
<link rel='icon' type='image/png' sizes='32x32' href='https://yezihack.github.io/images/favicon.ico'>
<link rel='icon' type='image/png' sizes='16x16' href='https://yezihack.github.io/images/favicon.ico'>
<link rel='manifest' href='https://yezihack.github.io/images/icons/site.webmanifest'>
<link rel="shortcut icon" href="https://yezihack.github.io/images/favicon.ico" />
<link rel="icon" sizes="32x32" href="https://yezihack.github.io/images/favicon.ico">
<link rel="Bookmark" href="https://yezihack.github.io/images/favicon.ico" />
<meta name='msapplication-TileColor' content='#da532c'>
<meta name='theme-color' content='#ffffff'>
  <link rel='canonical' href='https://yezihack.github.io/2019/08/build_hugo/'>
  <link rel = 'stylesheet' href = 'https://yezihack.github.io/css/main.34c570a3a70342bd493da22fe29cbc6662935af7011e94e7302b7422bf26594908393627b6e3efbf8e5dd9875b52386cc4825640896de1371e07e62f774e7b69.css' integrity = ''>
</head>

  <body>
    <div class = 'nav-drop'>
  <div class = 'nav-body'>
    
      <a href = 'https://yezihack.github.io/' class = 'nav_item'>首页</a>
    
      <a href = 'https://yezihack.github.io/about/' class = 'nav_item'>About</a>
    
      <a href = 'https://yezihack.github.io/categories/bluebat/' class = 'nav_item'>蝙蝠三省</a>
    
      <a href = 'https://yezihack.github.io/tags/golang/' class = 'nav_item'>Golang</a>
    
      <a href = 'https://yezihack.github.io/tags/php/' class = 'nav_item'>PHP</a>
    
      <a href = 'https://yezihack.github.io/tags/mysql/' class = 'nav_item'>MYSQL</a>
    
      <a href = 'https://yezihack.github.io/tags/linux/' class = 'nav_item'>LINUX</a>
    
      <a href = 'https://yezihack.github.io/tags/other/' class = 'nav_item'>OTHER</a>
    
    <div class = 'nav-close'></div>
  </div>
</div>
<header class = 'nav' >
  <nav class = 'nav-menu'>
    <a href='https://yezihack.github.io/' class = 'nav-brand nav_item'>百里の博客</a>
    <div class = 'nav_bar-wrap'>
      <div class = 'nav_bar'></div>
    </div>
  </nav>
</header>


    <main>
      

<section class = 'post_header' style = 'background-image:url(https://yezihack.github.io/images/default.jpg);'>
  <h1 class='post_title' itemprop='name headline'>hugo搭建github pages博客</h1>
</section>
<div class = 'post'>
  <article class='post_content'>
    

<h1 id="文档参考">文档参考</h1>

<ul>
<li><a href="https://gohugo.io/">hugo官方</a></li>
<li><a href="https://themes.gohugo.io/">hugo官网主题</a></li>
</ul>

<h1 id="第一步-创建一个github-pages">第一步: 创建一个github pages</h1>

<ul>
<li><a href="https://github.com/new">https://github.com/new</a></li>
</ul>

<h3 id="注意">注意</h3>

<p>创建 Repository name 仓库名称时,最好与你的用户名相同,如用户名为:yezihack,站点名为:yezihack.github.io</p>

<h1 id="第二步-安装hugo">第二步: 安装hugo</h1>

<blockquote>
<p>基于mac安装</p>
<div class="highlight"><pre style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-go" data-lang="go"><span style="color:#a6e22e">brew</span> <span style="color:#a6e22e">install</span> <span style="color:#a6e22e">hugo</span></code></pre></div></blockquote>

<h1 id="第三步-new一个站点">第三步: New一个站点</h1>
<div class="highlight"><pre style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-shell" data-lang="shell">hugo new site yezihack.github.com
 
<span style="color:#75715e"># 以下二个命令必须执行哦</span>
cd yezihack.github.com 
git init</code></pre></div>
<h1 id="第四步-下载一个主题">第四步: 下载一个主题</h1>

<blockquote>
<p>hugo-swift-theme 主题不错</p>
<div class="highlight"><pre style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4">git submodule add https://github.com/onweru/hugo-swift-theme.git themes/hugo-swift-theme</pre></div></blockquote>

<h2 id="复制一下官网给的demo">复制一下官网给的DEMO</h2>

<blockquote>
<p>-a 表示复制所有,最后一个点(.) 表示复制当前目录,文件目录最后必须有/</p>
</blockquote>
<div class="highlight"><pre style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4">cp -a themes/hugo-swift-theme/exampleSite/ .</pre></div>
<h1 id="第五步-将代码添加到github版本库">第五步: 将代码添加到github版本库</h1>

<blockquote>
<p>获取第一步创建的仓库地址: 如: git@github.com:yezihack/yezihack.github.io.git</p>
</blockquote>
<div class="highlight"><pre style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4">git remote add origin git@github.com:yezihack/yezihack.github.io.git</pre></div>
<h2 id="checkout一个分支并提交代码">checkout一个分支并提交代码</h2>

<blockquote>
<p>master用于存储hugo 生成的静态文件, 新建一个dev分支</p>
<div class="highlight"><pre style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4">git checkout -b dev</pre></div></blockquote>

<h3 id="新建一个-gitignore">新建一个.gitignore</h3>
<div class="highlight"><pre style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4">touch .gitigonre
echo &#34;public/&#34; &gt;&gt; .gitignore
echo &#34;.idea/&#34; &gt;&gt; .gitignore</pre></div>
<h3 id="将代码添加到版本库里并提交远端">将代码添加到版本库里并提交远端</h3>
<div class="highlight"><pre style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4">git add -A
git commit -m &#34;add hugo&#34;
git push -u origin dev</pre></div>
<h1 id="第六步-生成静态网站">第六步: 生成静态网站</h1>

<h2 id="编辑-config-toml-配置文件">编辑 config.toml 配置文件</h2>
<div class="highlight"><pre style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4">vim config.toml
# 找到baseurl字段,修改为你的站点名,如: https://yezihack.github.io/ 最后一定要加 /
baseurl = &#34;https://yezihack.github.io/&#34;</pre></div>
<h2 id="新建一个发布脚本">新建一个发布脚本</h2>
<div class="highlight"><pre style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4">touch sync.sh
vim sync.sh 
#将下面的sync.sh复制到sync.sh里
chmod +x sync.sh</pre></div>
<h3 id="脚步sync-sh">脚步sync.sh</h3>

<p>注意
- 修改baseurl
- 修改github</p>
<div class="highlight"><pre style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><span style="color:#75715e">#!/bin/bash
</span><span style="color:#75715e"></span><span style="color:#75715e">###########################</span>
<span style="color:#75715e"># 部署到 github pages 脚本</span>
<span style="color:#75715e"># 使用方法: ./sync.sh</span>
<span style="color:#75715e"># date: 2019.08.02</span>
<span style="color:#75715e">###########################</span>


baseurl<span style="color:#f92672">=</span><span style="color:#e6db74">&#34;https://yezihack.github.io&#34;</span>
github<span style="color:#f92672">=</span><span style="color:#e6db74">&#34;git@github.com:yezihack/yezihack.github.io.git&#34;</span>

<span style="color:#75715e"># 错误时终止脚本</span>
set -e
comment<span style="color:#f92672">=</span>$1
<span style="color:#66d9ef">if</span> <span style="color:#f92672">[</span> <span style="color:#e6db74">&#34;</span>$comment<span style="color:#e6db74">&#34;</span> <span style="color:#f92672">==</span> <span style="color:#e6db74">&#34;&#34;</span> <span style="color:#f92672">]</span>;<span style="color:#66d9ef">then</span>
    comment<span style="color:#f92672">=</span><span style="color:#e6db74">&#34;issue pages&#34;</span>
<span style="color:#66d9ef">fi</span>

<span style="color:#75715e"># 删除打包文件夹</span>
rm -rf public

<span style="color:#75715e">#生成静态文件</span>
hugo --theme<span style="color:#f92672">=</span>hugo-swift-theme

<span style="color:#75715e">#进入public</span>
cd public/

<span style="color:#75715e"># 初使git并加入版本库</span>
git init
git add -A
git commit -m <span style="color:#e6db74">&#34;</span>$comment<span style="color:#e6db74">&#34;</span>
<span style="color:#75715e">#推到master分支下</span>
git push -v -f <span style="color:#e6db74">&#34;</span>$github<span style="color:#e6db74">&#34;</span> master</pre></div>
<h2 id="执行脚步">执行脚步</h2>
<div class="highlight"><pre style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4">./sync.sh</pre></div>
    <div class = 'post_extra'>
      <div class = 'copy'></div>
    </div>
    





  </article>
  
  <aside>
    <h3>Recent Posts</h3>
<ul class='posts aside'>
  
  
  
  
  
  
    
    <li class = 'post_item'>
  <a class = 'post_card' href='/bluebat/27/' title = '第27期 蝙蝠三省(2019.08.09) 一剪梅·雨打梨花深闭门'>
    <img class = 'post_thumbnail' src='https://yezihack.github.io/images/bluebat/27.jpg'>
  </a>
  <div class = 'excerpt'>
    <div class = 'excerpt_meta'>
    
      
      <a href = 'https://yezihack.github.io/tags/elk' class = 'post_tag'>
        elk
      </a>
      
      
      <a href = 'https://yezihack.github.io/tags/hugo' class = 'post_tag'>
        hugo
      </a>
      
      
      <a href = 'https://yezihack.github.io/tags/%E5%B8%83%E9%9A%86%E8%BF%87%E6%BB%A4%E5%99%A8' class = 'post_tag'>
        布隆过滤器
      </a>
      
      <div class = 'post_copy copy hide'></div>
    </div>
    <h3 class = 'post_link'>
      <a href='/bluebat/27/'>第27期 蝙蝠三省(2019.08.09) 一剪梅·雨打梨花深闭门</a>
    </h3>
    <p class = 'pale'> 第27期 蝙蝠三省(2019.08.09) 一剪梅·雨打梨花深闭门 自明代唐寅的《一剪梅·雨打梨花深闭门》 雨打梨花深闭门，孤负青春，虚负青春。赏心乐事共谁论？花下销魂，月下销 …</p>
  </div>
</li>

    
  
    
    <li class = 'post_item'>
  <a class = 'post_card' href='/about/' title = 'About 百里的博客'>
    <img class = 'post_thumbnail' src='https://yezihack.github.io/images/baili.jpg'>
  </a>
  <div class = 'excerpt'>
    <div class = 'excerpt_meta'>
    
      <div class = 'post_copy copy hide'></div>
    </div>
    <h3 class = 'post_link'>
      <a href='/about/'>About 百里的博客</a>
    </h3>
    <p class = 'pale'>保持自己的好奇心 研究新技术 分享一些自己平时的工作与日常的思考的东西 结交志同道合之友  了解更多 GitHub.</p>
  </div>
</li>

    
  
    
  
</ul>
  </aside>
</div>
<script src = 'https://yezihack.github.io/js/autosize.min.js'></script>
<script src = 'https://yezihack.github.io/js/timeago.js'></script>

    </main>
    <footer class = 'footer'>
  <div class = 'footer_inner wrap pale'>
    <p>&copy; <span class = 'year'></span> 百里の博客</p>
    <p> <a href = 'https://github.com/yezihack' target = '_blank' title = 'github'
                rel = 'nonopener'> github</a></p>
  </div>
</footer>

<script src = 'https://yezihack.github.io/js/index.js'></script>

  </body>
</html>
